<template >
  <div v-if="dic" style="width:160px;position:fixed;margin-top: 20px;">
    <el-collapse v-model="activeName" accordion>
      <el-collapse-item v-for="parent in dic" :key="parent.name"   :title="parent.name" >
        <div  v-for="children in parent.children" :key="children.name">
          <p @click="loadArticl(parent)">{{children.name}}</p>
        </div>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
    export default {
      name: "blogSidebar",
      data() {
        return {
          activeName:'0',
          dic:{
            children:''
          },
          key:'1',
          navigation: {
            id:1,
            name:'',
            code:'',
          },
        };
      },
      methods:{
        //获取侧边栏
        getArticleNavigation(){
          let param = this.navigation;
          this.$http.post('/dic/navigation',param)
          .then(result=>{
            this.dic = result.data;
          }).catch(result=>{
            result;
            this.$message.error("操作失败")
          })
        },
        //查询此类文章
        loadArticl(e){
          this.$emit("getArticles",e)
        },
      },
      mounted(){
        this.getArticleNavigation();
      }
    }
</script>

<style scoped>

</style>
